layui.use(['layer', 'table', 'form'], function () {
    let table = layui.table,
        form = layui.form,
        layer = layui.layer;
    layui.layer.load(0, {shade: [0.5, '#fff']});
    /*查询所有公告的信息*/
    table.render({
        elem: '#task-teacher-table'
        , toolbar: '#task-teacher-table-toolbar'
        , height: 700
        , initSort: {field: 'id', type: 'desc'}
        , url: '/getTitle'
        , where: {type: 2, queryKey: ''}
        , cols: [
            [ //标题栏
                {field: 'xtId', title: '编号', width: 90, align: 'center', sort: true, fixed: "left"},
                {field: 'title', title: '标题', width: 200, align: 'center', fixed: "left"},
                {field: 'no', title: '申请教师编号', width: 130, align: 'center'},
                {field: 'addtime', title: '申请时间', width: 130, align: 'center'},
                {field: 'from', title: '课题来源', width: 120, align: 'center'},
                {field: 'categoty', title: '课题类别', width: 100, align: 'center'},
                {field: 'nature', title: '课题性质', width: 140, align: 'center'},
                {field: 'intr', title: '课题简介', align: 'center', width: 200},
                {field: 'collegeName', title: '选题学院', width: 130, align: 'center'},
                {field: 'majorName', title: '选题专业', width: 150, align: 'center'},

                {
                    field: 'state',
                    title: '审核状态',
                    width: 140,
                    align: 'center',
                    fixed: "right",
                    templet: function (res) {
                        if (res.state === '审核完成') {
                            return '<span style="color: green">审核完成</span>';
                        } else {
                            return '<span style="color: #1E9FFF">审核中</span>';
                        }
                    }
                },
                {
                    field: 'isPass',
                    title: '是否通过',
                    width: 140,
                    align: 'center',
                    fixed: "right",
                    templet: function (res) {
                        if (res.isPass === '不通过') {
                            return '<span style="color: red">不通过</span>';
                        } else if (res.isPass === '通过') {
                            return '<span style="color: green">通过</span>';
                        } else {
                            return '<span style="color: #1E9FFF">审核中</span>';
                        }
                    }
                },
                {field: 'opinoin', title: '审核意见', align: 'center', width: 120, hide: true},
                {field: 'tName', title: '指导老师', align: 'center', width: 120, hide: true},
                {field: 'tno', title: '指导老师编号', align: 'center', width: 120, hide: true},
                {title: '详情', align: 'center', width: 120, toolbar: '#msg-table-tool', fixed: "right"}
            ]
        ]
        // ,skin: 'line' //表格风格
        , even: true
        , page: true
        , limits: [14, 28, 42]
        , limit: 14
        , text: {
            none: '<div class="layui-anim layui-anim-scaleSpring"  style="margin-top: 150px"><i class="layui-icon" style="color: #009f95;font-size: 150px;border-bottom: #009f95 solid 2px;padding:15px;margin-top: 50px" >&#xe664;</i><br>' +
                '<br><br><br><br><div class="layui-text" style="font-size: 25px;margin-top: 25px;color: #009f95">好像没有没找到数据呢</div></div>'
            ,
            error: '<div style="margin-top: 150px"><i class="layui-icon"  style="color: #009f95;font-size: 150px;border-bottom: #009f95 solid 2px;padding:15px;margin-top: 50px" >&#xe664;</i><br>' +
                '<br><div class="layui-text" style="font-size: 25px;margin-top: 25px;color: #009f95">好像没有出错了呢</div></div>'
        }
    });


    //监听表头事件  监听对象  allUSer
    table.on('toolbar(task-teacher-table)', function (obj) {

        //查询事件
        if (obj.event === 'query') {  //按关键字搜索事件
            let queryKey = $('#queryKey').val().trim(); //获取搜索的关键字
            let major = $('#major').val(); // 获取专业
            if (queryKey === null || queryKey === '') {
                layer.msg('请输入要查询工号/姓名/课题名称', {offset: '250px', time: 1500, anim: 6});
                return false;
            }
            if (major === null || major === '') {
                layer.msg('请选择专业', {offset: '250px', time: 1500, anim: 6, area: ['200px', '50px']});
                return false;
            }
            table.reload('task-teacher-table', {
                where: {queryKey: queryKey, type: 2} //设定异步数据接口的额外参数
            });
        } else if (obj.event === 'add-task-teacher') {  //教师新增加一个课题
            layer.open({
                type: 1
                , offset: 10
                , skin: 'layui-layer-rim'
                , area: ['640px', '700px']
                , content: $("#add-task-teacher")
                , title: '课题详情内容'
                , success: function (layerObj) {
                    $(".layui-layer-shade").appendTo(layerObj.parent());
                }
                , end: function () {
                    $("#add-task-teacher").css("display", 'none');
                }
            });

        } else if (obj.event === 'queryAll') { //查询全部
            table.reload('task-teacher-table', {
                where: {queryKey: '', type: 2} //设定异步数据接口的额外参数
            });
        }
    });


    /*监听操作栏事件*/
    table.on('tool(task-teacher-table)', function (obj) {
        let data = obj.data;  //json格式的数据
        if (obj.event === 'detail') {  //课题详情
            layer.open({
                type: 1
                , offset: 100
                , skin: 'layui-layer-rim'
                , area: ['740px', '550px']
                , content: $("#task-detail")
                , title: '课题详情内容'
                , success: function (layero) {
                    let mask = $(".layui-layer-shade");
                    mask.appendTo(layero.parent());
                    /*设置回显数据*/
                    setTaskDetail(data);
                }
                , end: function () {
                    $("#task-detail").css("display", 'none');
                }
            });
        }
    });


    /*获取增加课题表单的数据*/
    form.on('submit(teacher-add-task-btn)', function (data) {
        console.log(data.field) //当前容器的全部表单字段，名值对形式：{name: value}
        let taskData = JSON.stringify(data.field);
        let loadPage = layui.layer.load(0, {shade: [0.5, '#fff']});
        $.ajax({
            url: "/addTitle",
            type: 'post',
            data: {
                taskData: taskData, userName: USERNAME, type: 2
            },
            dataType: 'json',
            success: function (data) {  //调用接口成功
                if (data === true || data === 'true') {
                    layer.close(loadPage);
                    layer.closeAll('page');
                    layui.layer.msg('申请成功！', {offset: '300px', time: 2500, anim: 0});
                    table.reload('task-teacher-table', {
                        where: {queryKey: '', type: 2}
                    });
                } else {
                    layui.layer.close(loadPage);
                    layui.layer.alert('申请失败！');
                }
            },
            error: function () {  //接口错误
                layui.layer.close(loadPage);
                layui.layer.alert('服务器出错啦,请稍后再试！');
            }
        });
        return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });


    layui.layer.closeAll('loading');
});

//设置课题回显数据
function setTaskDetail(data) {
    $("#task-id").html(data.xtId);
    $("#task-title").html(data.title);
    $("#task-tno").html(data.no);
    $("#task-addtime").html(data.addtime);
    $("#task-from").html(data.from);
    $("#task-category").html(data.categoty);
    $("#task-nature").html(data.nature);
    $("#task-intr").html(data.intr);
    $("#task-college").html(data.collegeName);
    $("#task-major").html(data.majorName);
    $("#task-state").html(data.state);
    $("#task-teacherName").html(data.tName);
    $("#task-teacherNO").html(data.tno);
    $("#task-opinion").html(data.opinoin);
}

